import React, { useEffect } from 'react';
import { Spin } from 'antd';
import { useNavigate } from 'react-router-dom';
import styles from './index.module.scss';
import useStore from '@/store';

const App = () => {
    const navigateTo = useNavigate();
    const mymenus = useStore((state) => state.usedMenu); // 在顶层调用 Hook

    useEffect(() => {
        const usedMenu = JSON.parse(mymenus); // 直接在 useEffect 中解析

        if (usedMenu && usedMenu.length > 0) {
            const index = usedMenu.indexOf('/dashBoard');  //找到工作台的下标
            if (index !== -1) {
                navigateTo(usedMenu[index], { replace: true }); //优先跳工作台,index
            } else {
                navigateTo(usedMenu[0], { replace: true }); //如果没有dashBoard,跳到不是/workplace的第一项
            }
        } else {
            navigateTo("/workplace");
        }
    }, [mymenus, navigateTo]); // 添加依赖项

    return (
        <div className={styles.contain}>
            <div className={styles.main}>
                <Spin size="large" />
                <div className={styles.text}>加载中...</div>
            </div>
        </div>
    );
}

export default App;
